<?php
defined('IN_XLP') or exit('Access Denied');
$Document = array(
    'pageid'   => 'task-sort', //页面标示
    'pagename' => '任务排序', //当前页面名称
    'mycss'    => array(), //加载的css样式表
    'myjs'     => array('task/sortable.min','global/jquery-1.9.0.min'), //加载的js脚本
    'footerjs' => array(),
    'head'     => true, //加载头部文件
);
include getTpl('header', 'public');
?>
<style>
#sort tr{cursor:pointer;height:40px;background:#f9f9f9 !important;}
#sort tr td{line-height:40px;}
</style>
<div style="margin:20px 0;font-size:16px;font-weight:bold;">*拖动排序*</div>
<table class="table table-striped b-t text-small">
    <thead>
        <tr>
            <th>任务ID</th>
            <th>任务标题</th>
            <th>结束时间</th>
        </tr>
    </thead>
    <tbody id="sort">
    <?php foreach ($task_list as $k => $v): ?>
    <tr data-id="<?php echo $v['id'] ?>">
        <td><?php echo $v['id'] ?></td>
        <td><?php echo $v['task_title'] ?></td>
        <td><?php echo $v['time_end'] ?></td>
    </tr>
    <?php endforeach ?>
    </tbody>
</table>
<button id="sorted">确&nbsp;定</button>
<script>
var list = document.getElementById("sort");
var option = {
    animation: 150,
    onUpdate: function (evt){
        var item = evt.item;
        // console.log(item);
    }
};
new Sortable(list, option);

$(function(){
    $('#sorted').click(function(){
        var sort_arr = [];
        $('#sort tr').each(function(index, dom){
            sort_arr.push($(dom).data('id'));
        });
        $.post("<?php echo U('task/sort') ?>", {"sort":sort_arr}, function(result){
            if(result.status==1) {
                parent.location.reload();
            } else {
                Msg.error(result.info);
            }
        }, 'JSON');
    });
});
</script>
</body>
</html>